<template>
	<view class="wrap">
		<view class="top">
			<text>违章车辆信息</text>
		</view>
		<view class="car-info-wrapper">
			<view class="car-info">
				<view class="list flex flex-h-start flex-v-center">
					<label for="">号牌种类：</label>
					<view>{{carType}}</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">车牌号码：</label>
					<view>{{lsnum}}</view>
				</view>
			</view>
		</view>
		<view class="top">
			<text>违章车辆信息</text>
		</view>
		<view class="record-info-wrapper" v-for="(item,index) in userObj" :key="index">
			<view class="record-info">
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章时间：</label>
					<view>{{item.date}}</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章地址：</label>
					<view>{{item.area}}</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章内容：</label>
					<view>{{item.act}}</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">罚款金额：</label>
					<view>
						<text>{{item.money}}</text>
						<text>扣分：{{item.fen}}分</text>
					</view>
				</view>
				<!-- <view class="list flex flex-h-start flex-v-center">
					<label for="">是否代办：</label>
					<view>
						<text>可以</text>
						<text>代办费用：620.00</text>
					</view>
				</view> -->
			</view>
		</view>
		<!-- <view class="record-info-wrapper">
			<view class="record-info" >
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章时间：</label>
					<view>2015-06-05 18:20:00</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章地址：</label>
					<view>新松江路近人民北路东侧路段</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">违章内容：</label>
					<view>违反规定停放、临时停车且驾驶人不在现场或驾驶人虽在现场拒绝立即驶离，妨碍其他车辆、行人通行的</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">罚款金额：</label>
					<view>
						<text>500.00</text>
						<text>扣分：3分</text>
					</view>
				</view>
				<view class="list flex flex-h-start flex-v-center">
					<label for="">是否代办：</label>
					<view>
						<text>可以</text>
						<text>代办费用：620.00</text>
					</view>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userObj: {},
				carType: "",
				lsnum: ''
			};
		},
		onLoad(options) {
			const item = JSON.parse(decodeURIComponent(options.item));
			this.userObj = item;
			console.log(this.userObj)
			this.carType = options.carType;
			this.lsnum = options.lsnum;
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {
		padding-bottom: 100rpx;

		.record-info-wrapper {
			padding: 0 40rpx 20rpx 40rpx;

			.record-info {
				box-shadow: #999 0rpx 0rpx 20rpx;
				border-radius: 10rpx;

				.list {
					padding: 30rpx;

					label {
						display: flex;
						width: 165rpx;
					}

					view {
						width: calc(100% - 165rpx);
					}
				}
			}
		}

		.car-info-wrapper {
			padding: 0 40rpx;

			.car-info {
				box-shadow: #999 0rpx 0rpx 20rpx;
				border-radius: 10rpx;

				.list {
					padding: 30rpx;
					border-bottom: 1rpx solid #efefef;

					label {
						display: flex;
						width: 165rpx;
					}

					view {
						width: calc(100% - 165rpx);
					}
				}
			}
		}

		.top {
			padding: 30rpx 40rpx;

			text {
				font-family: HiraginoSansGB-W3;
				font-size: 26rpx;
				color: #333;
			}
		}
	}
</style>
